import React, { Component, PropTypes } from 'react'
import { Icon } from 'antd-mobile'
import { Calendar } from '../common'

export default class CalendarList extends Component {
  render() {
    return (
      <div>
        <Calendar />

        <div className={`rt-data-box`}>
          <div className={`rt-top-box`}>
            <div>
              <span>07:01</span>
              <span className={`cn-country`}>英国</span>
            </div>
            <div>
              <span className={`rt-influence`}>影响力</span>
              <Icon type="star" />
              <Icon type="star" />
              <Icon type="star" />
            </div>
          </div>

          <div className={`rt-rest-box`}>
            <div className={`rt-descriptor`}>
              核心生产者输出物价指数（年率）
            </div>
            <div className={`rt-value-box`}>
              <div className={`rt-current`}>
                <span>现值</span>
                <span className={`rt-value`}>10%</span>
              </div>
              <div className={`rt-expect`}>
                <span>预期值</span>
                <span className={`rt-value`}>-2%</span>
              </div>
              <div className={`rt-previous`}>
                <span>前值</span>
                <span className={`rt-value`}>-1%</span>
              </div>
            </div>
          </div>
        </div>

        <div className={`rt-data-box`}>
          <div className={`rt-top-box`}>
            <div>
              <span>07:01</span>
              <span className={`cn-country`}>英国</span>
            </div>
            <div>
              <span className={`rt-influence`}>影响力</span>
              <Icon type="star" />
              <Icon type="star" />
              <Icon type="star-o" />
            </div>
          </div>

          <div className={`rt-rest-box`}>
            <div className={`rt-descriptor`}>
              核心生产者输出物价指数（年率）
            </div>
            <div className={`rt-value-box rt-vertical-display`}>
              <div className={`rt-current`}>
                <span>现值</span>
                <span className={`rt-value`}>10%</span>
              </div>
              <div className={`rt-expect`}>
                <span>预期值</span>
                <span className={`rt-value`}>-2%</span>
              </div>
              <div className={`rt-previous`}>
                <span>前值</span>
                <span className={`rt-value`}>-1%</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    )
  }
}